<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>考核管理页面</title>
	<link rel="stylesheet" type="text/css" href="../Styles/admin-all.css" />
    <link rel="stylesheet" type="text/css" href="../Styles/base.css" />
    <link rel="stylesheet" type="text/css" href="../Styles/bootstrap-3.3.7-dist/css/bootstrap.min.css" />
	<link rel="stylesheet" type="text/css" href="../Styles/bootstrap-3.3.7-dist/css/bootstrap-theme.min.css" />
    <script type="text/javascript" src="../Scripts/jquery.min.js"></script>
    <script type="text/javascript" src="../Styles/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="../Styles\laypage\laypage.js"></script>
    <script language="javascript" type="text/javascript" src="../Styles/My97DatePicker/WdatePicker.js"></script>
    <link href="../Styles/My97DatePicker/skin/WdatePicker.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    	#app{
    		width: 80%;
    		height: 60%;
    		margin: auto;
            margin-top: 30px;
    	}
    	.button-operation{
    		margin-bottom: 10px;
    	}
    </style>
</head>
<body>
<div id="app">
	<h2 style="margin-bottom: 20px;background: oldlace;height: 50px;padding-top: 8px">考核管理</h2>
    <div id="tr">
        <form action="" class="form-search">
        	
            <div class="search_area">
    			<form action="">
					<input type="hidden" name="ac" value="humancontract">
					<input type="hidden" name="do" value="list">
					<input type="hidden" name="fileurl" value="human">
        			<div class="form-search form-search-top" style="text-align:left;padding-left:10px;padding-bottom: 10px;">      			          
	        			<span class="adv-select-label">考核人：</span>
       					<input type="text" name="user" id="user" style="width:70px;height:20px;background-color:#F5F5F5;color:#006600;" value="" readonly="">
       					<input type="hidden" name="userid" id="userid" value=""> 
       					<a href="javascript:void(0)" id="adduname">+选择人员</a>
   						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<span class="adv-select-label">考核部门：</span>
       					<select name="type" style="width:90px;" id="type">
							<option value="0" selected="selected">请选择部门</option>
												
						</select>
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<span class="adv-select-label">考核状态：</span>
       					<select name="ckey" style="width:100px;" id="status">
							<option value="2" selected="selected">请选择状态</option>
							<option value="0">考核未进行</option>
							<option value="1">考核已结束</option>			
						</select>
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            			<button id="do_search" type="button" class="btn btn-primary">查 询</button>
           				&nbsp;&nbsp;&nbsp;
           				<button type="button" class="btn" id="showmore">切换更多查询</button>
        			</div>
        			
       				<div class="form-search form-search-bottom query-fom-search" id="dynamicDiv" style="margin-top: 10px; text-align: left; padding-left: 10px;padding-bottom: 10px;display:none;"> 
	   					<span class="adv-select-label">发布日期：</span>
       					<input id="date1" class="BigInput" type="text" name="testdate" style="width:168px;" size="20" onclick="WdatePicker({skin:'ext',dateFmt:'yyyy-MM-dd',minDate:'2008-03-08',maxDate:'2100-03-10'})">
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<span class="adv-select-label">考核日期：</span>
       					<input id="date2" class="BigInput" type="text" name="testdate" style="width:168px;" size="20" onclick="WdatePicker({skin:'ext',dateFmt:'yyyy-MM-dd',minDate:'2008-03-08',maxDate:'2100-03-10'})">
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
       				</div>   
    			</form>
			</div>
			
            <div class="button-operation">
				<button type="button" class="btn btn-success" onclick="javascript:window.location='addApp.jsp'">发布信息</button>				
				<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#deleModal">清理数据</button>				
			</div>

            <table class="table table-bordered table-hover" width="100%">
            	<thead>
            		<tr class="info"><th colspan="11">考核列表</th></tr>
	            	<tr class="editThead info" align="center">
	      				<td width="40" style="width: 40px;"><input type="checkbox" value="1" id="chkall" name="chkall" onclick="check_all()"></td>
	      				<td width="100" style="width: 100px;">考核编号</td>
						<td style="width: 137px;">考核名称</td>
						<td style="width: 100px;">考核人</td>
						<td width="120" style="width: 120px;">考核部门</td>
						<td width="120" style="width: 120px;">发布日期</td>
						<td width="120" style="width: 120px;">考核日期</td>
						<td width="100" style="width: 130px;">考核合格率(%)</td>
						<td width="100" style="width: 100px;">考核状态</td>
						<td width="100" style="width: 100px;">发布人</td>
						<td width="120" style="width: 120px;">操作</td>
	   				</tr>
   				</thead>
   				<tbody id="tb">
   					
   				</tbody>
   			</table>
            <div id="page" style="float: right;"></div>
        </form>
    </div>
    
    <!-- 模态框（Modal） -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
						&times;
					</button>
					<h4 class="modal-title" id="myModalLabel">
						显示员工姓名表单
					</h4>
				</div>
				<div class="modal-body">
					<form action="">
						<input type="hidden" value="" class="tr_id" name="hid"/>
						<table class="table table-hover">
							<thead>
					        	<tr class="info"><th>显示部门名称</th><th>显示员工名称</th></tr>
					        </thead>
					        <tbody id="tb">
					        	<tr><td id="tb1" class='error'></td><td id="tb2"></td></tr>			
					        </tbody>
					        							
						</table>
					</form>
				</div>
				<div class="modal-footer">  
	                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>  
	                <button type="button" class="btn btn-primary" id="btn1">确定</button>  
	            </div> 
			</div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>
	
	<!-- 查看考核信息 -->
    <div class="modal fade" id="selectApp" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
						&times;
					</button>
					<span style="font-size: 20px"><img alt="" src="../img/select.png"> <span id="ar_name"></span>   考核信息浏览</span>
				</div>
				<div class="modal-body">
					<form name="save" method="post" action="">
						<table class="table" border="0" width="90%" align="center" style="border-bottom:#4686c6 solid 0px;">
						    <tbody>
						      <tr>
						        <td nowrap="" class="warning" width="20%">考核名称</td>
						        <td class="d1" width="30%"></td>
						        <td nowrap="" class="warning" width="20%">考核编号</td>
						        <td class="d2" width="30%"></td>
						      </tr>
							 
							  <tr>
						        <td nowrap="" class="info"> 考核部门</td>
						        <td class="d3"></td>
						        <td nowrap="" class="info"> 考核状态</td>
						        <td class="d4"></td>
						      </tr>
						      
						      <tr>
						      	<td nowrap="" class="success"> 发布日期：</td>
						        <td class="d5"></td>
						        <td nowrap="" class="success"> 考核日期：</td>
						        <td class="d6"></td>
						      </tr>
							  						 						      
							  <tr>
						        <td nowrap="" class="info"> 考核人</td>
						        <td class="d9"></td>
						        <td nowrap="" class="info"> 发布人</td>
						        <td class="d10"></td>
						      </tr>				 
						   						      
							  <tr>
						        <td nowrap="" class="success" > 附件文档：</td>
						        <td class="d11" colspan="3"><input type="hidden" class="d13" value=""/></td>
						      </tr>
						      
							  <tr>
							  	<td nowrap="" class="warning" > 备注：</td>
						        <td colspan="3" nowrap="" class="d12"></td>
						      </tr>
							</tbody>
						</table>
					</form>
					
				</div>
				<div class="modal-footer">  
	                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>  
	                <button type="button" class="btn btn-primary" data-dismiss="modal">确定</button>  
	            </div> 
			</div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>
	
	<!-- 删除模态框（Modal） -->
	<div class="modal fade" id="deleModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">温馨提示</h4>
				</div>
				<div class="modal-body">您确定清理这些数据吗？？？？	</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="button" class="btn btn-primary" data-dismiss="modal" id="moredel">确定</button>
				</div>
			</div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>
</div>

<script type="text/javascript">

/*全选/反选触发函数*/
function check_all(){
     var del = document.getElementById("chkall").checked;
     var arrState = document.getElementsByName("chk1");
    
     for(var i = 0;i<arrState.length;i++){
            arrState[i].checked = del;
            
     }
 }

	var ar_appuser=$("#user").val();
	var ar_dept_id=$("#type").val();
	var ar_status=$("#status").val();
	var ar_issdate=$("#date1").val();
	var ar_appdate=$("#date2").val();
	
	var currentPage=1;
	
	$(function(){
		
		//删除  批量删除
    	$(document).on('click','#moredel',function(){
    		obj=document.getElementsByName("chk1");
    		check_val=[];
    		var str="";
    		for(i in obj){
    			if(obj[i].checked){
    				str+=obj[i].value+","
    				check_val.push(obj[i].value);
    				
    			}
    		}
    		console.log(str)
    		if(str==''){
    			alert("您选择的数据未审批或者您还没有选择数据！！！！！");
    		}else{
    			$.ajax({
    				url:'../showApp/deleteMore',
    				data:{'str':str},
    				dataType:'json',
    				type:'post',
    				success:function(result){
    					alert("删除成功");
    					getApp();
    				}
    			})
    		}
    		
    	});
		
		//点击事件，查看信息
		$(document).on('click','#ar_num',function(){
			var ar_num=$(this).html();
			console.log(ar_num);
			var status=null;
			var percent;
			$.ajax({
				url:"../showApp/findApp",
				type:"post",
				data:{"ar_num":ar_num},
				dataType:"json",
				
				success:function(result){
					console.log(result);
					if(result.appUserDept.ar_status==0){
	   					 status="考核未进行";
	   					 percent="";
	   					 
	   				 }else if(result.appUserDept.ar_status==1){
	   					 status="考核结束";
	   					 percent=result.appUserDept.ar_percent;
	   				 }else{
	   					 status="";
	   				 }
					$("#ar_name").html(result.appUserDept.ar_name);
					$(".d1").html(result.appUserDept.ar_name);
					$(".d2").html(result.appUserDept.ar_num);
					$(".d3").html(result.appUserDept.deptname);
					$(".d4").html(status);
					$(".d9").html(result.appUserDept.ar_appuser);
					$(".d10").html(result.appUserDept.uname);
					$(".d5").html(result.appUserDept.ar_issdate);
					$(".d6").html(result.appUserDept.ar_appdate);
					
					$(".d11").html("<a href='../showCon/down?fileName="+result.appUserDept.ar_enclo+"' id='down'>下载附件</a>");
					$(".d13").html(result.appUserDept.ar_enclo);
					$(".d12").html(result.appUserDept.ar_remaks);
					$("#selectApp").modal("show");
				}
			})
			
		});
		
		//显示考核列表
		getApp();
		function getApp(){
			$.ajax({
				url:"../showApp/findAppraise",
				type:"post",
				data:{"currentPage":currentPage,"appuser":ar_appuser,"dept":ar_dept_id,"status":ar_status,"issdate":ar_issdate,"appdate":ar_appdate},
				dataType:"json",
				
				success:function(result){
					console.log(result);
	    			var status=null;
	    			var percent;
	    			 $("#tb").html("");
	    			 $.each(result.appUserDepts,function(inx,ele){
	    				 if(ele.ar_status==0){
	    					 status="考核未进行";
	    					 percent="";
	    					 
	    				 }else if(ele.ar_status==1){
	    					 status="考核结束";
	    					 percent=ele.ar_percent;
	    				 }else{
	    					 status="";
	    				 }
	    				 $("#tb").append(
	    					"<tr class='editThead' align='center'>"+
	    		      			"<td width='40' style='width: 40px;'><input type='checkbox' name='chk1' value='"+ele.ar_id+"'></td>"+
	    		      			"<td width='100' style='width: 100px;'><a href='javascript:void(0)' id='ar_num'>"+ele.ar_num+"</a></td>"+
	    						"<td style='width: 267px;'>"+ele.ar_name+"</td>"+
	    						"<td width='120' style='width: 120px;'>"+ele.ar_appuser+"</td>"+
	    						"<td width='100' style='width: 100px;'>"+ele.deptname+"</td>"+
	    						"<td width='120' style='width: 120px;'>"+ele.ar_issdate+"</td>"+
	    						"<td width='120' style='width: 120px;'>"+ele.ar_appdate+"</td>"+
	    						"<td width='100' style='width: 100px;'>"+percent+"</td>"+
	    						"<td width='100' style='width: 100px;'>"+status+"</td>"+
	    						"<td width='100' style='width: 100px;'>"+ele.uname+"</td>"+
	    						"<td width='120' style='width: 120px;'><a href='../showApp/findApp1?ar_id="+ele.ar_id+"'>编辑</a></td>"+
	    		   			"</tr>"	
	   					 )
	    				
	   					laypage({
	     					  cont: $("#page"),  //容器
	     					  pages: result.pages, //总页数
	     					  curr:currentPage,     //当前页, 
	     					  skin: 'molv', //皮肤
	     					  skip:true, //支持跳页的功能
	     					  last:'尾页',
	     					  groups:3,  //多少页进行分组
	     					  jump: function(obj, first){ //触发分页后的回调
	     						currentPage = obj.curr;
	     					    if(!first){   //一定要加此判断，否则初始时会无限刷新
	     					      getApp();  //获取当前页
	     					    }
	     					  }
	     					});
	    			 })
				}
			})
		};
		
		//点击查询按钮
		$("#do_search").click(function(){
			ar_appuser=$("#user").val();
			ar_dept_id=$("#type").val();
			console.log(ar_dept_id);
			ar_status=$("#status").val();
			ar_issdate=$("#date1").val();
			ar_appdate=$("#date2").val();
			getApp();
			$("#dynamicDiv").hide();
	   	});
		
		//查询的部门选择框的显示
		getDept();
		function getDept(){
			$.ajax({
				url:"../showCon/findSec",
				type:"post",
				dataType:"json",
				
				success:function(result){
					console.log(result.sections);
					$("#type").html("");
					$("#type").append("<option value='0' selected='selected'>请选择部门</option>")
	   			 	$.each(result.sections,function(inx,ele){
	   			 		$("#type").append(
							"<option value='"+ele.seorid+"'>"+ele.deptname+"</option>"
						 )
	   			 	})
				}
			})
		};
		
		//点击显示更多查询信息
		$(document).on('click','#showmore',function(){
			$("#dynamicDiv").show();
		});
		
		//点击查询按钮
		$("#do_search").click(function(){
			con_emp=$("#user").val();
			console.log(con_emp);
			con_type=$("#type").val();
			console.log(con_type);
			con_status=$("#status").val();
			console.log(con_status);
			con_signdate=$("#date1").val();
			con_trydate=$("#date2").val();
			
			$("#dynamicDiv").hide();
	   	});
		
		//点击事件，显示部门名称
		$(document).on('click','#adduname',function(){
			$.ajax({
				url:"../showCon/findSec",
				type:"post",
				dataType:"json",
				
				success:function(result){
					console.log(result.sections);
					$("#myModal").modal("show");
					$("#tb1").html("");
	   			 	$.each(result.sections,function(inx,ele){
	   			 		$("#tb1").append(
								"<ul><li><a href='javascript:void(0)' id='uname'>"+ele.deptname+"</a><input type='hidden' value='"+ele.seorid+"' id='hid'/></li></ul>"
	   			 				/* "<tr><td class='warning' id='deptname'><a href='javascript:void(0)' id='uname'>"+ele.deptname+"</a></td><td></td></tr>" */
						 )
	   			 	})
				}
			})
			
		});
		
		//点击事件，显示部门成员信息
		$(document).on('click','#uname',function(){
			var seorid=$(this).siblings("#hid").val();
			console.log(seorid);
			$.ajax({
				url:"../showCon/findUser",
				type:"post",
				data:{"seorid":seorid},
				dataType:"json",
				
				success:function(result){
					console.log(result.users);
					
					$("#tb2").html("");
	   			 	$.each(result.users,function(inx,ele){
	   			 		$("#tb2").append(
								"<ul><li><input type='radio' name='m' value='"+ele.uname+"'/><a href='javascript:void(0)' id='uname'>"+ele.uname+"</a></li></ul>"
						 )
	   			 	})
				}
			})
			
		});
		
		//弹出层的确定按钮的点击时间
		$(document).on('click','#btn1',function(){
			var uname=$("input[type='radio']:checked").val();
			console.log(uname);
			$("#myModal").modal("hide");
			$("#user").val(uname);		
		});
	})
</script>
</body>
</html>